<template>
	<view class="uploadTeamFile-container">
		<view class="" style="background-color: white;height: 100vh;padding: 20rpx;border-radius: 5px;">
			<view class="">
				上传文件：
			</view>
			<Attachment mode="create" :canUploadFile="true" :uploadFileUrl="uploadUrl" :oneFile="oneFile"
				@uploadSuccess="uploadSuccess" :header="header" :showProcess="true" :attachmentList.sync="attachmentList"></Attachment>
			<view class="uploadFile-contaienr">
				<button class="cu-btn bg-green margin-tb-sm lg"
					@tap="upload">立即上传</button>
			</view>
			<view class="">
				文件名称：
			</view>
			<view class="input-contaienr">
				<input type="text" v-model="uploadFileForm.file_name" />
			</view>
		</view>
	</view>
</template>

<script>
	import Attachment from '../../components/jin-attachment/jin-attachment.vue';
	export default {
		data() {
			return {
				uploadFileForm:{
					team_id: this.teamId,
					file_name: '',
					files: ''
				},
				fileName:'',
				upUrl:'',
				teamDetailList: [],
				attachmentList:[],
				teamId:'',
				header: {
					'token': ''
				},
				uploadUrl: 'https://kehu.ruoyiweb.hellomky.cn/' + this.$myHttp.urlMap.uploadFiles,
				// uploadUrl: upUrl,
			};
		},
		components:{
			Attachment
		},
		computed:{
			oneFile(){
				return (this.attachmentList && this.attachmentList.length !== 0) ? true : false;
			}
		},
		onLoad(query) {
			let token = JSON.parse(uni.getStorageSync('vuexvuex'))
			var parsedData = JSON.parse(token.value);
			var tokenValue = parsedData.userinfo.token;
			let domainPrefix = this.$myHttp.config.baseUrl;
		
			// domainPrefix = domainPrefix.replace(/\/$/, '');
			this.header['token'] = tokenValue;
			
			// 从 query 中获取传递的参数
			this.uploadFileForm.team_id = query.id || '';
		
		},
		methods:{
			async upload() {
				console.log(this.uploadFileForm.file_name)
				if(this.uploadFileForm.file_name == ''){
					uni.showToast({
						title: '请输入文件名！',
						icon: 'none'
					});
					return
				} else if ( this.uploadFileForm.files == '' ){
					uni.showToast({
						title: '请上传文件！',
						icon: 'none'
					});
					return
				} else {
					let res = await this.$myHttp.post({
								
						url: this.$myHttp.urlMap.competitionTeamDetailAddFile,
						data: this.uploadFileForm
					})
					console.log('res321',res)
					if(res.code == 1){
						uni.showToast({
							title: res.msg,
							icon: 'success', // 图标，可选值：success/loading/none
							duration: 2000, // 提示框显示时间，单位为毫秒
							mask: true, // 是否显示透明蒙层，防止触摸穿透
							// success: function() {
							// 	// showToast 完成后执行跳转
							// 	setTimeout(function() {
							// 		this.attachmentList = []
							// 		this.uploadFileForm.file_name = ''
							// 	}, 1000);
							// },
						});
					}
				}
				
			},
			uploadSuccess(result) {
				const fileUrl = JSON.parse(result.data)
				console.log('fileUrl: ', fileUrl)
				
				// 获取文件扩展名
				const fileExtension = fileUrl.data.url.split(".").pop().toLowerCase();
				console.log('fileExtension: ', fileExtension)
				
				this.uploadFileForm.files = fileUrl.data.url
				// 根据扩展名判断文件类型
			// 	if (fileExtension === "jpg" || fileExtension === "jpeg" || fileExtension === "png" || fileExtension === "gif") {
			// 	    // 这是一个图片文件
			
			// 	    // 将图片 URL 存放到图片变量中
			// 		if (this.ImagesList) {
			// 		    // 如果 this.ImagesList 不为空，则添加逗号
			// 		    this.ImagesList += ',';
			// 		}
					
			// 		this.ImagesList += fileUrl.data.url;
					
			
					
			// 	} else {
			// 	    // 这是其他类型的文件
			
			// 	    // 将文件 URL 存放到附件变量中
			// 		if (this.filesList) {
			// 		    // 如果 this.ImagesList 不为空，则添加逗号
			// 		    this.filesList += ',';
			// 		}
					
			// 		this.filesList += fileUrl.data.url;
			
				    
			// 	}
				if (result.statusCode == 200) {
					//上传成功的回调处理
					uni.showToast({
						title: '上传成功',
						icon: 'none'
					});
				} else {
					uni.showToast({
						title: '上传失败',
						icon: 'none'
					});
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
		
	.input-contaienr{
		width: 100%;
		border-bottom: 1rpx solid #ccc;
	}
	.uploadFile-contaienr{
		display: flex;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		background-color: white;
		border-top: 1rpx solid #F4F4F4;
		padding: 20rpx;
		button{
			width: 100%;
		}
		
	}
	.uploadTeamFile-container{
		padding: 20rpx;
		
	}
</style>
